<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="Cache-Control" content="max-age:0" />
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />
    <meta http-equiv="Expires" content="0" />
    <meta name="viewport" id="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=auto" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="defualt" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <!-- UC应用模式 -->
    <meta name="browsermode" content="application" />
    <!-- QQ应用模式 -->
    <meta name="x5-page-mode" content="app" />
    <title>设置</title>

    <style>
        html,
        body {
            -ms-touch-action: none;
            background: cadetblue;
            padding: 0;
            border: 0;
            margin: 0;
            width: 100vw;
            height: 100vh;
            position: relative;
            overflow: visible;
            -webkit-overflow-scrolling: touch;
        }

        .rootDiv {
            width: 100%;
            height: 100%;
            background: #cadetblue;
            border-radius: 10px;
            margin: 0px auto;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-items: center;
        }

        .input {
            width: 80%;
            height: 60px;
            border: none;
            font-size: 24px;
        }

        .buttons {
            width: 80%;
            height: 80px;
            margin-top: 30px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-items: center;
            justify-self: center;
            justify-content: center;
        }

        .button {
            display: flex;
            flex: 1;
            align-items: center;
            justify-items: center;
            justify-self: center;
            justify-content: center;
            height: 100%;
            font-size: 24px;
        }

        button:focus {
            background-color: green;
            color: #FFF;
            font-size: 30px;
        }
    </style>
</head>

<body>
<div class="rootDiv">
    <div style="height: 100px;color: #FFF;font-size: 40px;font-weight: bold;">地址设置</div>
    <input class="input" type="text" value="" id="inputText" />
    <div class="buttons">
        <button onclick="clickSure()" class="button">确定</button>
        <button onclick="clickCancel()" class="button">取消</button>
        <button onclick="clickExit()" class="button">关闭程序</button>
    </div>

    <div class="buttons">
        <button onclick="clickSound()" class="button">测试声音</button>
        <button onclick="liangduAdd()" class="button">亮度+</button>
        <button onclick="liangdujian()" class="button">亮度-</button>
        <button onclick="setSoundVo()" class="button">音量+</button>
        <button onclick="setSoundVoJian()" class="button">音量-</button>
    </div>

    <div class="buttons">
        <button onclick="reBoot()" class="button">重启</button>
        <button onclick="shutDown()" class="button">关机</button>
        <button onclick="lockNow()" class="button">休眠</button>
        <button onclick="turnOnScreen()" class="button">唤醒</button>
        <button onclick="getIp()" class="button">获取IP</button>
    </div>
    <div id="ipDiv">
        IP：
    </div>
</div>
</body>
<script>
    function clickSure() {
        str=document.getElementById("inputText").value;
        AndroidBrowser.saveUrlSet(str);
    }
    function clickCancel() {
        AndroidBrowser.closeUrlSet();
    }
    function clickExit() {
        AndroidBrowser.exit();
    }
	function clickSound(){
		AndroidBrowser.jsSpeak("请张三到..,口腔科四诊室#$..  5号座位就诊");
	}
    var vo=1;
	function setSoundVo(){
	    this.vo++;
	    AndroidBrowser.setAndroidVolume(this.vo);
	    document.getElementById("ipDiv").innerText="音量:"+this.vo;
	}
	function setSoundVoJian(){
	    this.vo--;
	    AndroidBrowser.setAndroidVolume(this.vo);
	    document.getElementById("ipDiv").innerText="音量:"+this.vo;
	}
	var briht=0;
	function liangduAdd(){
	    this.briht+=0.1;
		AndroidBrowser.setWindowBrightness(this.briht);
		document.getElementById("ipDiv").innerText="亮度:"+this.briht;
	}
	function liangdujian(){
	    this.briht-=0.1;
		AndroidBrowser.setWindowBrightness(this.briht);
		document.getElementById("ipDiv").innerText="亮度:"+this.briht;
	}
	function reBoot(){
		AndroidBrowser.reBoot();
	}
	function shutDown(){
		AndroidBrowser.shutDown();
	}
	function setPowerOnOff(){
		AndroidBrowser.setPowerOnOff();
	}
	function getIp(){
		var ipStr=AndroidBrowser.getIp();
		document.getElementById("ipDiv").innerText="IP:"+ipStr;
	}
	function turnOnScreen(){
        AndroidBrowser.turnOnScreen();
	}
	function lockNow(){
        AndroidBrowser.lockNow(1);
        var _this=this;
        setTimeout(function(){
            AndroidBrowser.turnOnScreen1();
        },5000);
	}

    window.onload=function(){
        if(window["AndroidBrowser"]){
            var url=AndroidBrowser.getUrl();
            document.getElementById("inputText").value=url;
        }
    }

</script>

</html>